@import '@/uni.scss';
::v-deep .uContainer {
	height: 100% !important;
	padding-bottom: 0;
}

.container {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	.banner {
		width: 100%;
		image {
			width: 100%;
		}
	}
	.content {
		margin-top: 20rpx;
		padding: 30rpx;
		width: calc(100% - 60rpx);
		height: calc(100% - 80rpx - 80rpx - 80rpx);
		background: $uni-bg-color;
		box-shadow: 0rpx 8rpx 16rpx 0rpx #fff;
		border-radius: 30rpx 30rpx 0 0;
		overflow: auto;
		.list {
			width: 100%;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			flex-wrap: wrap;
			.proItem {
				margin-bottom: 20rpx;
				width: 332rpx;
				height: fit-content;
				background: #fff;
				box-shadow: 0 0 10rpx #fff inset;
				border-radius: 10rpx;
				overflow: hidden;
				display: flex;
				flex-direction: column;
				.itemThumb {
					width: 100%;
					font-size: 0;
					position: relative;
					> image {
						width: 332rpx;
						height: 332rpx;
						background: #fff;
					}
					> text {
						position: absolute;
						right: 2rpx;
						bottom: 2rpx;
						padding: 0 10rpx;
						width: max-content;
						height: 36rpx;
						display: flex;
						justify-content: center;
						align-items: center;
						border-top-left-radius: 20rpx;
						border-bottom-right-radius: 20rpx;
						background: rgba(255, 255, 255, 0.8);
						font-weight: 400;
						font-size: 20rpx;
						color: $uni-secondary-color;
					}
				}
				> .itemH1 {
					margin-top: 10rpx;
					padding: 0 20rpx;
					width: calc(100% - 40rpx);
					overflow: hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-line-clamp: 2;
					word-break: break-all;
					-webkit-box-orient: vertical;
					> .label {
						display: inline-block;
						background: $uni-warning;
						border-radius: 4rpx;
						padding: 0rpx 8rpx 4rpx;
						margin-right: 8rpx;
						font-weight: 400;
						font-size: 24rpx;
						color: #fff;
					}
					> .name {
						flex: 1;
						font-weight: 400;
						font-size: 28rpx;
						color: $uni-main-color;
					}
				}
				> .itemH2 {
					margin-top: 10rpx;
					padding: 0 20rpx;
					width: calc(100% - 40rpx);
					display: flex;
					flex-direction: row;

					.price {
						flex: 1;
						display: flex;
						flex-direction: row;
						justify-content: flex-start;
						align-items: baseline;
						> text {
							font-weight: 400;
							font-size: 26rpx;
							color: $uni-secondary-color;
						}
						> rich-text {
							font-weight: 400;
							font-size: 26rpx;
							color: $xxf-red;
						}
						> text:nth-child(1) {
							color: $xxf-red;
						}
						> rich-text:last-child {
							color: $uni-secondary-color;
							text-decoration: line-through;
						}
					}
					::v-deep.uni-icons {
						color: $uni-primary !important;
					}
				}
				> .itemH3 {
					margin-top: 8rpx;
					padding: 0 20rpx;
					width: calc(100% - 40rpx);
					display: flex;
					flex-direction: row;
					flex-wrap: wrap;
					> text {
						margin-right: 8rpx;
						margin-bottom: 8rpx;
						padding: 4rpx 8rpx;
						background: $uni-bg-color;
						border-radius: 8rpx;
						font-weight: 400;
						font-size: 24rpx;
						color: $uni-warning;
					}
				}
			}
		}
	}
}
